<html>

<head>
    <title>GUIDE</title>
    <script src="https://cdn.jsdelivr.net/npm/vue"></script>
    <script src="https://cdn.staticfile.org/jquery/3.2.1/jquery.min.js"></script>
    <script src="https://cdn.bootcss.com/jquery-cookie/1.4.1/jquery.cookie.min.js"></script>
    <link rel="stylesheet" href="./css/guide.css" />
    <link rel="stylesheet" href="./TemplateData/style.css" />
    <link rel="stylesheet" href="./css/footer.css" />
    <script src="./TemplateData/UnityProgress.js"></script>
    <script src="./Build/UnityLoader.js"></script>
    <script src="./js/csrf.js"></script>
</head>

<body>
    <div class="index-header">
        <div class="container"></div>
        <span><a href="index.html" class="icon" style="text-decoration: none;">SHAKESPEARE</a></span>
            <ul class="nav-link-group">
                <li>
                    <a href="find.html">PROJECT
                        <br>学习项目</a>
                </li>
                <li>
                    <a href="guide.html">GUIDE
                        <br>医院导览</a>
                </li>
                <li>
                    <a href="mytest.html">TEST
                        <br>在线测试</a>
                </li>
                <li>
                    <a href="#">CONTACT
                        <br>联系我们</a>
                </li>
            </ul>
            <div class="login-block" id="login-block">
                <a href="./login.html?redirect=guide.html" v-if="user_id === null || user_id === '' || user_id === undefined">登录</a>
                <a href="./register.html" v-if="user_id === null || user_id === '' || user_id === undefined">
                    注册</a>
                <p v-else>欢迎，{{email}}
                    <a href="#" v-on:click="logout">登出</a>
                </p>
            </div>
        </div>
        <div class="webgl-content">
            <div id="gameContainer" style="width: 100%; height: 590px;"></div>
        </div>
    </div>
    <div id="guide">
        <div class="bg-grey">
            <div class="room-name">
                {{chName}}
            </div>
            <div class="paragraph">
                <p class="p-title">科室功能</p>
                <p class="p-title">FUNCTION</p>
                <div class="p-body-divide-left">
                    <p>{{chDescription}}</p>
                </div>
                <div class="p-body-divide-right">
                    <p>{{enDescription}}</p>
                </div>
            </div>
        </div>
        <div class="paragraph">
            <p class="p-title">科室仪器</p>
            <p class="p-title">INSTRUMENT</p>
            <div class="p-body-divide-left">
                <p>{{chItemDesc}}</p>
            </div>
            <div class="p-body-divide-right">
                <p>{{enItemDesc}}</p>
            </div>
        </div>
        <div class="paragraph">
            <p class="p-title">主要负责人</p>
            <p class="p-title">OFFICER</p>
            <ul id="carousel">
                <li v-for="worker in workers">
                    <div class="p-three">
                        <div class="photo">
                            <img v-bind:src="worker.headPictureUrl" />
                        </div>
                        <p>
                            {{worker.description}}
                        </p>
                        <div class="name-title">
                            <h4>{{worker.name}}</h4>
                            <h6>{{worker.extra}}</h6>
                        </div>
                    </div>
                </li>
            </ul>
        </div>
        <div class="paragraph">
            <p class="p-title">治疗费用</p>
            <p class="p-title">FARE</p>
            <div class="p-body-divide-left">
                <p>{{bill}}</p>
            </div>
        </div>
    </div>
    <div class="tail">
        <div class="tail_left">
            <div class="tail_left_l">
                <div class="circle_1"></div>
                <div class="text_1">
                    <p>SHAKESPEAR</p>
                </div>
            </div>

            <div class="tail_left_r">
                <div class="text_2">
                    <p>StraBe 12
                        <br>12345 Irgendwo,Deutschland
                        <br>
                        <br>hallo@website.de</p>
                </div>
            </div>
        </div>

        <div class="tail_right">
            <div class="photo1">
                <img src="./img/tail1.png" />
            </div>
            <div class="photo2">
                <img src="./img/tail2.png" />
            </div>
            <div class="photo3">
                <img src="./img/tail3.png" />
            </div>

            <div class="text_3">
                <p>@2016 Shasta.Slle Rechte vorbehalten</p>

            </div>
        </div>
        <script src="./js/guide.js"></script>
        <script src="./js/loginblock.js"></script>
        <script>
            var gameInstance = UnityLoader.instantiate("gameContainer", "Build/finalhos_2.json", { onProgress: UnityProgress });
            function test_r() {
                vm.$emit('room', '前台');
            }
            function test_cat() {
                vm.$emit('room', '猫科');
            }
            function test_s() {
                vm.$emit('room', '外科');
            }
        </script>
</body>

</html>